/* Bottom panel with game actions */

footer a[data-panel=trades] {
	background-image: url(../images/assets/ui/toolbar/trades.png);
}

footer a[data-panel=storage] {
	background-image: url(../images/assets/ui/toolbar/storage.png);
}

footer a[data-panel=buildings] {
	background-image: url(../images/assets/ui/toolbar/build.png);
}

footer a[data-panel=council] {
	background-image: url(../images/assets/ui/toolbar/council.png);
}

footer a[data-panel=world] {
	background-image: url(../images/assets/ui/toolbar/worldmap.png);
}

footer a[data-panel=ranks] {
	background-image: url(../images/assets/ui/toolbar/ranks.png);
}

footer a[data-panel=debug] {
	background-image: url(../images/assets/ui/toolbar/debug.png);
}

footer a[data-panel=help] {
	background-image: url(../images/assets/ui/toolbar/help.png);
}

/* Panel footer icons */

.panel header .close {
	background: transparent url(../images/ui/close.png) no-repeat;
}

.panel footer .attack span {
	background: transparent url(../images/assets/ui/icons/attack.png) no-repeat;
}

.panel footer .spy span {
	background: transparent url(../images/assets/ui/icons/spy.png) no-repeat;
}

.panel footer .scout span {
	background: transparent url(../images/assets/ui/icons/spy.png) no-repeat;
}

.panel footer .ceasefire span {
	background: transparent url(../images/assets/ui/icons/sign.png) no-repeat;
}

.panel footer .claim span {
	background: transparent url(../images/assets/ui/icons/upgrade.png) no-repeat;
}

.panel footer .unclaim span {
	background: transparent url(../images/assets/ui/icons/downgrade.png) no-repeat;
}

.panel footer .caravan span {
	background: transparent url(../images/assets/ui/icons/caravan.png) no-repeat;
}

.panel footer .join span {
	background: transparent url(../images/assets/ui/icons/home.png) no-repeat;
}

.panel footer .alliance span {
	background: transparent url(../images/assets/ui/icons/alliance.png) no-repeat;
}

.panel footer .pact span {
	background: transparent url(../images/assets/ui/icons/pact.png) no-repeat;
}

.panel footer .start span {
	background: transparent url(../images/assets/ui/icons/start.png) no-repeat;
}

.panel footer .pause span {
	background: transparent url(../images/assets/ui/icons/stop.png) no-repeat;
}

.panel footer .demolish span {
	background: transparent url(../images/assets/ui/icons/demolish.png) no-repeat;
}

.panel footer .war span {
	background: transparent url(../images/assets/ui/icons/war.png) no-repeat;
}

.panel footer .upgrade span {
	background: transparent url(../images/assets/ui/icons/upgrade.png) no-repeat;
}

.panel footer .downgrade span {
	background: transparent url(../images/assets/ui/icons/downgrade.png) no-repeat;
}

/* Building notifications */

.game .building .notification.error {
	background: transparent url(../images/assets/ui/icons/notify-error.png) no-repeat;
}

.game .building .notification.paused {
	background: transparent url(../images/assets/ui/icons/notify-pause.png) no-repeat;
}

.game .building .notification.requirements {
	background: transparent url(../images/assets/ui/icons/notify-missing.png) no-repeat;
}

/* Others */

.ach.img {
	background: transparent url(../images/assets/ui/icon_achievement.png) no-repeat;
}

.loading {
	background: transparent url(../images/ui/loading.svg) no-repeat;
}

.notifications .notty .hide,
.achievements-notifications .notty .hide {
	background: transparent url(../images/ui/close.png) no-repeat;
}

.panel ul.advices li {
	background: transparent url(../images/ui/check.png) no-repeat left top;
}

.religion-list .religion {
	background: transparent url(../images/assets/ui/religion.png) no-repeat center;
}

.game {
	background: $body-bg url(../images/city/map.jpg) no-repeat;
}

.panel td a.sbtn.start {
	background: transparent url(../images/assets/ui/icons/start.png) no-repeat;
}

.panel td a.sbtn.pause {
	background: transparent url(../images/assets/ui/icons/stop.png) no-repeat;
}

#window-battle .battleground {
	background: transparent url(../images/battle/bg2.png) no-repeat;
}

a.wikipedia {
	background: transparent url(../images/ui/wikipedia.png) no-repeat;
}

a.github {
	background: transparent url(../images/ui/github.png) no-repeat;
}

.window .avatar-select-top {
	background: url(../images/ui/avatar-background.png) no-repeat center center;
}
.window fieldset {
	background: 
		url(../images/ui/border-top-left.png) no-repeat left top,
		url(../images/ui/border-top-right.png) no-repeat right top,
		url(../images/ui/border-bottom-right.png) no-repeat right bottom,
		url(../images/ui/border-bottom-left.png) no-repeat left bottom,
		url(../images/ui/border-top.png) repeat-x left top,
		url(../images/ui/border-right.png) repeat-y right bottom,
		url(../images/ui/border-bottom.png) repeat-x right bottom,
		url(../images/ui/border-left.png) repeat-y left bottom,
		url(../images/ui/panel-background.png) repeat left top;
}

.window .button {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px 0px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) 0,
		url(../images/ui/buttons-bg.png) repeat-x 0 0
}

.window .button.highlight {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px -106px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) -106px,
		url(../images/ui/buttons-bg.png) repeat-x 0 -106px
}

.window .button.button-gray {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px -159px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) -159px,
		url(../images/ui/buttons-bg.png) repeat-x 0 -159px
}

.window .button.button-green {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px -212px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) -212px,
		url(../images/ui/buttons-bg.png) repeat-x 0 -212px
}

.window .button.button-blue {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px -265px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) -265px,
		url(../images/ui/buttons-bg.png) repeat-x 0 -265px
}

.window .button:hover {
	background: 
		url(../images/ui/buttons-bg-corners.png) no-repeat -219px -53px,
		url(../images/ui/buttons-bg-corners.png) no-repeat calc(100% + 131px) -53px,
		url(../images/ui/buttons-bg.png) repeat-x 0 -53px !important;
}

.ui > footer {
	background: 
		url(../images/ui/border-top-left.png) no-repeat left top,
		url(../images/ui/border-top-right.png) no-repeat right top,
		url(../images/ui/border-top.png) repeat-x left top,
		url(../images/ui/border-right.png) repeat-y right bottom,
		url(../images/ui/border-left.png) repeat-y left bottom,
		url(../images/ui/panel-background.png) repeat left top;
}

.ui > header {
	background: 
		url(../images/ui/border-bottom.png) repeat-x right bottom,
		url(../images/ui/panel-background.png) repeat left top;
}

.avatar-banner {
	background: url(../images/ui/avatar-banner-circle.png) no-repeat;
}

.character-info:after {
	background: url(../images/ui/avatar-banner-flag.png) no-repeat;
}

.ui .progress {
	background: 
		url(../images/ui/progress-bar-corners-big.png) no-repeat -50px 0px,
		url(../images/ui/progress-bar-corners-big.png) no-repeat calc(100% + 50px) 0,
		url(../images/ui/progress-bar-big.png) repeat-x 0 0;
}

.ui .progress.small {
	background: 
		url(../images/ui/progress-bar-corners-small.png) no-repeat -25px 0px,
		url(../images/ui/progress-bar-corners-small.png) no-repeat calc(100% + 25px) 0,
		url(../images/ui/progress-bar-small.png) repeat-x 0 0;
}

.ui .panel footer a {
	background: url(../images/ui/button-bg.png) no-repeat 0 0;
}

.ui .panel header .close {
	background: url(../images/ui/panel-close.png) no-repeat left top;
}

.ui .panel footer a.light-link {
	background: url(../images/ui/button-bg.png) no-repeat -100px 0;
}

.ui .panel footer a.green-link {
	background: url(../images/ui/button-bg.png) no-repeat -150px 0;
}

.ui .panel footer a.red-link {
	background: url(../images/ui/button-bg.png) no-repeat -200px 0;
}

.ui .panel footer a.blue-link {
	background: url(../images/ui/button-bg.png) no-repeat -250px 0;
}

.ui .panel footer a.indigo-link {
	background: url(../images/ui/button-bg.png) no-repeat -300px 0;
}

.ui .panel footer a.orange-link {
	background: url(../images/ui/button-bg.png) no-repeat -350px 0;
}

.ui .panel footer a:hover{
	background: url(../images/ui/button-bg.png) no-repeat -50px 0 !important;
}

.ui .panel {
	background: 
		url(../images/ui/border-top-left.png) no-repeat left top,
		url(../images/ui/border-top-right.png) no-repeat right top,
		url(../images/ui/border-bottom-right.png) no-repeat right bottom,
		url(../images/ui/border-bottom-left.png) no-repeat left bottom,
		url(../images/ui/border-top.png) repeat-x left top,
		url(../images/ui/border-right.png) repeat-y right bottom,
		url(../images/ui/border-bottom.png) repeat-x right bottom,
		url(../images/ui/border-left.png) repeat-y left bottom,
		url(../images/ui/panel-background.png) repeat left top;
}

.ui > aside {
	background: 
		url(../images/ui/border-left.png) repeat-y left bottom,
		url(../images/ui/panel-background.png) repeat left top;
}

.ui .btn,
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px 0px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) 0,
		url(../images/ui/tab-bg.png) repeat-x 0 0;
}

.ui .btn.gray,
.ui-tabs .ui-tabs-nav li.gray .ui-tabs-anchor {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px -108px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) -108px,
		url(../images/ui/tab-bg.png) repeat-x 0 -108px;
}

.ui .btn.green,
.ui-tabs .ui-tabs-nav li.green .ui-tabs-anchor {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px -144px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) -144px,
		url(../images/ui/tab-bg.png) repeat-x 0 -144px;
}

.ui .btn.blue,
.ui-tabs .ui-tabs-nav li.blue .ui-tabs-anchor {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px -180px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) -180px,
		url(../images/ui/tab-bg.png) repeat-x 0 -180px;
}

.ui .btn:hover,
.ui-tabs .ui-tabs-nav .ui-tabs-anchor:hover {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px -36px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) -36px,
		url(../images/ui/tab-bg.png) repeat-x 0 -36px !important;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
	background: 
		url(../images/ui/tab-bg-corners.png) no-repeat -36px -72px,
		url(../images/ui/tab-bg-corners.png) no-repeat calc(100% + 42px) -72px,
		url(../images/ui/tab-bg.png) repeat-x 0 -72px !important;
}
